<%@include file="/page/tag.jsp"%>
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title></title>
<!--框架必需start-->
<script type="text/javascript" src="${ctp}/QUI/libs/js/jquery.js"></script>
<%-- <script type="text/javascript" src="${ctp}/js/qui/language/cn.js"></script> --%>
<script type="text/javascript" src="${ctp}/QUI/libs/js/language/cn.js"></script>
<script type="text/javascript" src="${ctp}/QUI/libs/js/framework.js"></script>
<link href="${ctp}/QUI/libs/css/import_basic.css" rel="stylesheet"	type="text/css" />
<link href="${ctp}/QUI/libs/skins/lightBlue/style.css" rel="stylesheet" type="text/css" id="theme" themeColor="deepBlue"/>
<!-- 表单验证start -->
<script src="${ctp}/QUI/libs/js/form/validationRule.js" type="text/javascript"></script>
<script src="${ctp}/QUI/libs/js/form/validation.js" type="text/javascript"></script>
<!-- 表单验证end -->

<!-- 树组件start -->
<script type="text/javascript" src="${ctp}/js/qui/ztree.js"></script>
<link type="text/css" rel="stylesheet" href="${ctp}/css/ztree.css"></link>
<!-- 树组件end -->

<!-- 树形下拉框start -->
<script type="text/javascript" src="${ctp}/QUI/libs/js/form/selectTree.js"></script>
<!-- 树形下拉框end -->

<!-- 日期选择框start -->
<script type="text/javascript" src="${ctp}/QUI/libs/js/form/datePicker/WdatePicker.js"></script>
<!-- 日期选择框end -->

<!--自动提示框start-->
<script type='text/javascript' src='${ctp}/QUI/libs/js/form/suggestion.js'></script>
<!--自动提示框end-->


<!--数据表格start-->
<script src="${ctp}/js/qui/quiGrid.js" type="text/javascript"></script>
<!--数据表格end-->

<!--框架必需end-->

<style>
.del_f{
	margin-left: 10px;
}

#tb_goods{
	width: 100%;
}
</style>
</head>
<body style="width: 700px;">
	<div style="text-align: center; margin-top:10px; margin-bottom: 10px; font-size: 18px;">业务入单</div>
	<form id="ff" target="frmright" class="" method="post" action="" failAlert="验证未通过" style="width: 720px;">
		<table class="tableStyle" formMode="line">
			
			<tr>
				<td colspan="5" >
					<div class="ali01">
							<table class="tableStyle">
								<tr>
									<td><div class="ali01"><div style="display: inline-block; float:left;">规格：</div><div id="suggestionGoods" style=""  class="suggestion"  inputWidth="150"></div></div></td>
									<td><div class="ali01">颜色：<input id="addGoodsColor" type="text" class=""/></div></td>
									<td><div class="ali01">数量：<input id="addGoodsCount" type="text" class=""  value=""/></div></td>
									<td><div class="ali01">单价：<input id="addGoodsPrice" type="text" class=""/></div></td>
									
									<!-- <td>
										<input id="addGoodsUnit"  type="hidden" class=""/>
										<div class="ali03" style=""><button type="button" id="addGood">添加商品</button>
										</div>
									</td> -->
								
								</tr>
								<tr>
									<td colspan="5">
										<input id="addGoodsUnit"  type="hidden" class=""/>
										<div class="ali03" style="margin-right:70px;"><button type="button" id="addGood">添加</button>
										</div>
									</td>
								</tr>
							</table>
					</div>
				</td>
			</tr>
			
			<tr>
			
				<td colspan="2" >
					<div style="display: inline-block; float:left; margin-top:5px;">客户：</div><div id="suggestionCrm" name="fromQjOrder.crmCustomerInfo.crmCustomerInfoId" style="display: inline-block;"  class="validate[required] suggestion"  inputWidth="200" ></div>
				</td>
				<td colspan="2" style="width:210px;">
					<div style="display: inline-block;float:left;">付款方式：</div>
					<select name="fromQjOrder.payType">
						<option value="带税" selected="selected">带税</option>
						<option value="不带税">不带税</option>
					</select>
				</td>
				<td colspan="1" >
					<div class="ali01">订单总价: <span id="show_totalPrice">0</span></div>
				</td>
			</tr>
			
			<tr>
				<td colspan="5" >
					 <div id="maingrid"></div>
				</td>
			</tr>
			
			<tr class="">
				<td style="    width: 75px;">备注：</td>
				<td colspan="4">
					<textarea rows="" cols="" name="fromQjOrder.remark" style="width: 95%;"></textarea>
					<div id="fromMore">
					</div>
				</td>
			</tr>
			
			<tr>
				<td colspan="5">
					<input type="hidden" name="fromQjOrder.processId" value="${processId }"/>
					<input id="submitFBtn" type="button" value="提交" onclick="submitF()" />
				 	<input type="reset" value="取消" onclick="closeWin()" />
				 </td>
			</tr>
		</table>
	</form>
	<script>
		function closeWin() {
			top.Dialog.close();
		}

		function submitF() {
			  if($("#ff").validationEngine({returnIsValid: true})){
				  //清空list数据
				  $("#fromMore").html("");
				  var gd = g.records, j=0;
				  for(var i in gd){
					  if(gd[i].goodName == '') {
						  top.Dialog.alert("请删除空白行。",null,null,null,2)
						  return false;
						} else{
							$("#fromMore").append('<input name="fromQjOrderDetailList['+j+'].erpGoodInfo.erpGoodInfoId" type="hidden" value="'+gd[i].goodInfoId+'"/>');
							$("#fromMore").append('<input name="fromQjOrderDetailList['+j+'].count" type="hidden" value="'+gd[i].count+'"/>');
							$("#fromMore").append('<input name="fromQjOrderDetailList['+j+'].price" type="hidden" value="'+gd[i].cost+'"/>');
							$("#fromMore").append('<input name="fromQjOrderDetailList['+j+'].color" type="hidden" value="'+gd[i].color+'"/>');
						}
					  j++;
				  }
				  
			 	$.ajax({
					url : "${ctp}/quanjin/applySave.do",
					type : "post",
					data : $("#ff").serialize(),
					beforeSend: function(XHR){
						$("#submitFBtn").attr("disabled",true); 
					},
					complete:function(XMLHttpRequest){
						$("#submitFBtn").attr("disabled",false); 
					},
					success : function(data) {
						var popBox = new top.Dialog({
							Width:300,
	       					Height:110
						});
						if (data.result) {
							popBox.Title = data.msg;
							popBox.InnerHtml = '<table height="100%" border="0" align="center" cellpadding="10" cellspacing="0">\
										<tr><td align="right"><input type="button" id="Icon_' + this.ID + '" class="icon_alert" align="absmiddle"></td>\
											<td align="left" id="Message_' + this.ID + '" style="font-size:' + (popBox.defaultFontSize) + 'px;font-family:' + (popBox.defaultFontFamily) + '">' + data.msg + '</td></tr>\
									</table>';
							popBox.ShowCloseButton = false;
							popBox.ShowCancelButton = false;
							
							popBox.OKEvent = function() {
								popBox.close();
								top.frmright.reflushList();
								top.Dialog.close();
							};
							popBox.show();
							popBox.okButton.parentNode.style.textAlign = "center";
						} else {
							top.Dialog.alert(data.msg, null, null, null, 2);
						};
					}
				}); 
			 	
			 	
			 };
		}
		
		var g, goodsList;
		
		
		function initComplete(){
			
			$.ajax({
				url:"${ctp}/erpGoodInfo/companyAllGoods.do",
				success:function(data){
					var list = new Array();
					for(var i in data){
						list.push({"value": data[i].erpGoodInfoId, "key":data[i].goodName, "goodUnit":data[i].goodUnit, "suggest":data[i].goodCode +"|"+data[i].shortPinyin + "|"+data[i].fullPinyin, "cost":data[i].goodCostPrice});
					}
					goodsList = {"list":list};
					goodsStock = data;
					
					$("#suggestionGoods").data("data", goodsList);
				    $("#suggestionGoods").render();
				    
					buildGrid();
				}
			});
			
			
			$.ajax({
				url:"${ctp}/crmCustomerInfo/crmCustomerInfo_list.do?filter_EQS_sysUserInfo.sysUserInfoId=${sessionScope.userInfo.sysUserInfoId}",
				success:function(data){
					var result = data.result;
					var list = new Array();
					for(var i in result){
						list.push({"value": result[i].crmCustomerInfoId, "key":result[i].customerName, "suggest":result[i].customerName +"|"+result[i].shortPinyin + "|"+result[i].fullPinyin});
					}
					
					$("#suggestionCrm").data("data",  {"list":list});
				    $("#suggestionCrm").render();
				    
					buildGrid();
				}
			});
			
		}
		
		function buildGrid(){
			var gdate = {"rows":[]};
			g = $("#maingrid").quiGrid({
				columns: [ 
				         // { display: 'ID',  name: 'goodInfoId',  isAllowHide: true,   align: 'center', hide:true, width:"2%"},
				          { display: '规格',  name: 'goodName',  isAllowHide: false,   align: 'center',  width:"30%"},
				          { display: '颜色',  name: 'color',  isAllowHide: false,   align: 'center',  width:"10%"
				          },
				          { display: '单价',  name: 'cost', isAllowHide: false, align: 'center',  width:"20%"
				          },
				          { display: '数量',  name: 'count', isAllowHide: false, align: 'center',  width:"10%"
				          },
				          { display: '单位',  name: 'goodUnit',  isAllowHide: false,   align: 'center',  width:"10%" },
				          { display: '操作', isAllowHide: false, align: 'center',  width:"10%", render: function (rowdata, rowindex, value, column){
							  return '<div class="padding_top4 padding_left5">'
							  + '<span class="img_delete hand" title="删除" onclick="onDel(\'' + rowindex+ '\')"></span>' 
							  + '</div>';
							}
						  }
				          ], 
				          data:gdate,
				          rownumbers:true,
				          percentWidthMode:false,
				          enabledSort:false,
				          checkbox:false,
				          usePager: false,
				          
				          height: '68%',
				          width:"98%",
				          
				          enabledEdit: true,onBeforeEdit: onBeforeEdit, onBeforeSubmitEdit: onBeforeSubmitEdit,onAfterEdit: onAfterEdit,
				          
				          frozen:false,
				          toolbar:{
				        	  items:[
				        	         /* {text: '添加商品', click: addColumn,    iconClass: 'icon_add'} */
				        	         ]
				          }
			});
		}
		
		function addColumn(){
			var totalRecord = g.records;
			var rowdata = {
					goodName: "",
					cost: "",
					count: 0,
					goodUnit: ""
		        };
			g.add(rowdata);
		}
		
		
		function onBeforeEdit(e){
			//console.log('onBeforeEdit...');
		}
		
		function onBeforeSubmitEdit(e){
			//console.log('onBeforeSubmitEdit...');
		}
		
		function onAfterEdit(e){
			try{
				if(e.column.name == 'goodName'){
					e.record.goodUnit = e.record.goodUnit;
					e.record.cost = e.record._cost;
				}
				
				if(e.column.name == 'cost' || e.column.name == 'count'){
					countTotalPrice();
				}
				
				}catch (e1) {
					//console.log(e1);
				}
			//选择商品后
		}
		
		function onDel(rowindex){
			var row = g.getRow(rowindex);
			g.deleteRow(row);
		}
		
		
		function countTotalPrice(){
			var totalPrice = 0;
			var gd = g.getData();
			for(var i in gd){
				if(gd[i].goodName == ''){
					continue;
					//$("#"+objId).tip({showCloseBtn:true,content: "请选择商品信息"});
				} else{
					totalPrice += parseInt(gd[i].cost) * parseInt(gd[i].count);
				}
			}
			$("#totalPrice").val(totalPrice);
			$("#show_totalPrice").html(totalPrice);
		}
		
		var goodsStock;
		$(function(){
			
			//选中商品
			$("#suggestionGoods").bind("listSelect",function(e,obj){
				var id = obj.relValue;
				for(var i in goodsStock){
					 if(goodsStock[i].erpGoodInfoId == id){
						$("#addGoodsPrice").val(goodsStock[i].goodCostPrice);
						$("#addGoodsCount").val("0");
						$("#addGoodsUnit").val(goodsStock[i].goodUnit);
					} 
				}
		    });
		    
			//添加商品
			$("#addGood").click(function(){
				//var id =$("#suggestionGoods").attr("relText");
				var id =$("#suggestionGoods").attr("relValue");
				if(id == undefined || id==''){
					top.Dialog.alert("请选择商品");
					return false;
				}
				var totalRecord = g.records;
				var rowdata = {
						goodInfoId:id,
						goodName: $("#suggestionGoods").attr("relText"),
						cost: $("#addGoodsPrice").val(),
						color: $("#addGoodsColor").val(),
						count: $("#addGoodsCount").val(),
						goodUnit: $("#addGoodsUnit").val()
			        };
				g.add(rowdata);
				countTotalPrice();
				$("#suggestionGoods").render();
				$("#addGoodsPrice").val("");
				$("#addGoodsColor").val("");
				$("#addGoodsCount").val("");
				$("#kucunSpan").html("");
			});

		});
		
	</script>
</body>
</html>

